<template>
	<div class="easyd-weixin-Box">

		<div class="app_page_box" style="bottom: 50px;">
			<div class="app_page">
				<div class="communication_manage_list app_box_content_list app_list_box MARGIN_BOTTOM_10" v-for="item in communicationData">
					<img :src="item.mc_title_image" />
					<div class="communication_manage_info">
						<div class="app_box_flex">
							<div class="app_box_content_left">
								{{item.mc_title}}
							</div>
						</div>
						<div class="app_box_flex C4 T3">
							<div class="app_box_flex_1">
								阅读：{{item.browseCount}}次
							</div>
							<div class="app_box_flex_1" style="text-align: center;">
								分享：{{item.shareCount}}次
							</div>
							<div class="app_box_flex_1" style="text-align: right;">
								成交：{{item.buyCount}}次
							</div>
						</div>
					</div>
					<div class="communication_manage_time C4 T3">
						<span class="app_float_left">{{$common.dateFormat("YYYY/MM/dd",item.mc_create_time)}}</span>
						<div class="app_float_right">
							<!-- <span style="color: #316bff;">编辑</span> -->
							<!-- <span>删除</span> -->
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="app_bottom_box">
			<!-- <div class="app_bottom_box_right" @click="communicationAdd()">
				创建传播内容
			</div> -->
		</div>

	</div>
</template>

<script>
	import { mapState, mapMutations } from "vuex";
	export default {

		data() {
			return {

			};
		},
		computed: {
			...mapState({
				   communicationData : state => state.CommunicationManageModule.communicationData
			})
		},
		mounted() {
			this.initData();
		},
		methods: {
			initData(){
				this.$easyUtil.startLoading(this);
				this.$http.getHttp(this.$API.communicationRelatedCommunicationManagement, rs => {
					this.$easyUtil.endLoading(this);
					console.log(rs);
					this.$store.commit("CommunicationManageModule/updateCommunicationData", rs.propagationInfo);
					
				});
			},
			communicationAdd(e) {
				this.$router.push({
					path : '/communicationAdd'
				})
			},
		}
	};
</script>

<style lang="stylus" scoped>
	@import '~PUBLIC_CSS';
	.communication_manage_list {
		overflow: hidden;
	}
	
	.communication_manage_list .communication_manage_info {
		float: initial;
	}
	
	.communication_manage_list .communication_manage_time {
		overflow: hidden;
		width: 100%;
	}
	
	.communication_manage_list .communication_manage_time .app_float_right span {
		margin-left: 20px;
	}
	
	.communication_manage_list .communication_manage_time .app_float_right .btn {
		border: 1px solid #fbd415;
		padding: 0 10px;
		line-height: initial;
		border-radius: 4px;
		margin-top: 5px;
	}
	
	.communication_manage_list img {
		display: block;
		height: 50px;
		width: 70px;
		padding: 5px 10px 5px 0;
		float: left;
		object-fit: cover;
	}
</style>